<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/home.css" />
    <link rel="stylesheet" href="./css/reset.css" />
    <link rel="stylesheet" href="./css/service.css">
    <link rel="stylesheet" href="./css/amuseOneself.css">
    <script src="./jquery-3.5.1.min.js"></script>
</head>

<body>
    <div class="top">
        <div class="topbar w">
            <div class="topbar_left">
                <img src="https://www.play17.cn/img/logo.png?v=692557" alt="" />
                <ul>
                    <li>首页</li>
                    <li>
                        <a href="./html/plan.html">星宿计划</a>
                    </li>
                    <li>
                        <a href="./html/optimize.html">优选别墅</a>
                    </li>
                    <li><a href="./html/amuseOneself.html">游玩攻略</a></li>
                    <li>
                        <a href="./html/service.html">配套服务</a>
                    </li>
                </ul>
            </div>
            <div class="topbar_right">
                <p>业主房源加盟</p>

                <a href="#">登录</a> /
                <a href="#">注册</a>
            </div>
        </div>
    </div>
    <div class="banner">
        <img id="banner_item" src="https://api.play17.cn/Uploads/2022-10-10/63439e3199b17.jpeg" alt="" />
        <img id="banner_item" src="https://api.play17.cn/Uploads/2020-10-20/5f8ec102529ef.jpg" alt="" />
        <img id="banner_item" src="https://api.play17.cn/Uploads/2019-07-11/5d26f95a09873.jpg" alt="" />
    </div>
    <div class="search_box w">
        <div class="search_top">

        </div>
        <div class="search_center">
            <img class="logo" src="https://www.play17.cn/img/img-slogan.png" alt="">
            <h3>5重保障，确保每一次安心入住</h3>
            <ul>
                <li>
                    <img src="https://www.play17.cn/img/ico50-a.png" alt="">
                    <h4>干净</会>
                        <p>星级布草一客一换干净舒适</p>
                </li>
                <li>
                    <img src="https://www.play17.cn/img/ico50-a.png" alt="">
                    <h4>干净</会>
                        <p>星级布草一客一换干净舒适</p>
                </li>
                <li>
                    <img src="https://www.play17.cn/img/ico50-a.png" alt="">
                    <h4>干净</会>
                        <p>星级布草一客一换干净舒适</p>
                </li>
                <li>
                    <img src="https://www.play17.cn/img/ico50-a.png" alt="">
                    <h4>干净</会>
                        <p>星级布草一客一换干净舒适</p>
                </li>
                <li>
                    <img src="https://www.play17.cn/img/ico50-a.png" alt="">
                    <h4>干净</会>
                        <p>星级布草一客一换干净舒适</p>
                </li>
            </ul>
        </div>
    </div>
    <div class="list_area">
        <h2>热门目的地</h2>
        <div class="destination w">
            <div class="left">
                <ul>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2021-12-07/61af0c8a2eb1f.jpg" alt="">
                    </li>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2021-04-01/6065953958945.jpg" alt="">
                    </li>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2021-12-07/61af1c8dbd176.jpg" alt="">
                    </li>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2021-07-15/60efaaed0c252.jpg" alt="">
                    </li>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2021-07-15/60efae82b7ffd.jpg" alt="">
                    </li>
                    <li>
                        <p>查看更多</p>
                    </li>
                </ul>
            </div>
            <div class="right">
                <ul>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2021-12-07/61af1e8fb4501.jpg" alt="">
                    </li>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2020-08-06/5f2be76d02bce.png" alt="">
                    </li>
                    <li>
                        <img src="https://api.play17.cn/Uploads/2019-11-01/5dbc1568e8f8a.jpg" alt="">
                    </li>

                </ul>
            </div>
        </div>
        <div class="f_mt30 w">
            <h2>趣墅优品</h2>
            <div>
                <ul class="adress_title">
                    <li>清远</li>
                    <li>清远</li>
                    <li>清远</li>
                    <li>清远</li>
                    <li>清远</li>
                </ul>
                <hr>
            </div>
            <ul class="f_mt30_item">
                <li>
                    <img src="https://static-open.play17.cn/product_goods/materi…2-04/601bd1f62c798.jpg?x-oss-process=style/medium"
                        alt="">
                    <div class="txt">
                        <h3>趣墅清远烟雨江南温泉度假村·清泉石流</h3>
                        <p>￥898/<span>晚起</span></p>
                        <hr>
                        <p>
                            温泉/泳池 趣墅清远烟雨江南温泉度假村·清泉石流
                        </p>
                    </div>

                </li>
            </ul>
        </div>
    </div>
</body>
<script>
    let img = document.querySelectorAll("#banner_item");
    let num = 0;
    // console.log((img[0].style.display = "none"));
    img[0].style.display = "block";
    setInterval(() => {
        if (num < img.length - 1) {
            num++;
        } else {
            num = 0;
        }
        for (var i = 0; i < img.length; i++) {
            img[i].style.display = "none";
        }
        img[num].style.display = "block";
    }, 3000);
</script>

</html>